.container {
  padding-top: 0.1px;
}

.icon_wrapper {
  display: grid;  
  grid-template-columns: 1fr 1fr 1fr 1fr;
  background-image: linear-gradient(to right, #f78c78, #eabe79);
}

.icon_container {
  height: 80px;
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  border-left: 1px solid rgba($color: #FFF, $alpha: 0.6);
  border-bottom: 1px solid rgba($color: #FFF, $alpha: 0.6);
  color: #FFF;
  position: relative;
  transition: all 0.4s;

  &:nth-child(3n) {
    &::before {
      position: absolute;
      content: '';
      display: block;
      width: 6px;
      height: 6px;
      border-radius: 4px;
      background-color: #FFF;
      left: -3px;
      top: -3px;
    }
  }
  &:nth-child(5n + 1) {
    &::before {
      position: absolute;
      content: '';
      display: block;
      width: 6px;
      height: 6px;
      border-radius: 4px;
      background-color: #FFF;
      left: -3px;
      top: -3px;
    }
  }
  &:nth-child(4n) {
    border-right: 1px solid rgba($color: #FFF, $alpha: 0.6);
  }
  &:last-child {
    border-right: 1px solid rgba($color: #FFF, $alpha: 0.6);
  }
  &:active, &:focus {
    background-color: #ef725c;
  }
}

.icon_name {
  font-size: 10px;
}

.ad_btn_wrapper {
  display: flex;
  align-items: center;
  margin: 26px 16px;
  border: 1px solid #51aa38;
  border-radius: 15px;
  box-shadow: 0 0 20px 3px rgba($color: #000000, $alpha: 0.07);
}

.ad_icon_wrapper {
  width: 80px;
  height: 80px;
  display: flex;
  justify-content: center;
  align-items: center;
  
}

.ad_btn_info {
  flex: 1;
}
.ad_btn_desc {
  font-size: 15px;
}
.ad_btn_tip {
  font-size: 13px;
  margin-top: 10px;
  color: rgba($color: #000000, $alpha: 0.4);
  text-decoration: underline;
}